<template>
    <div class="doc-content-wrapper">
        <div class="doc-content-container">
            <div class="doc-content">
                <h2 class="mb-5 flex items-center">字符串转GeoJson</h2>
                <Codemirror :code="toGeoJsonCode1" name="字符串转GeoJson" class="mb-10" />
            </div>
        </div>
    </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'

export default defineComponent({
    setup () {
        const toGeoJsonCode1 = ref(`var layerData = [
    'MULTIPOLYGON(((116.508599 39.891822,116.493149 39.89188,116.49316 39.892703,116.492736 39.892645,116.492715 39.891888,116.489797 39.891888,116.489797 39.892999,116.48904 39.893007,116.489051 39.891896,116.488568 39.891904,116.488563 39.891271,116.497478 39.891164,116.497237 39.885702,116.497473 39.885426,116.497484 39.88275,116.490194 39.882824,116.49007 39.881635,116.48992 39.881618,116.490059 39.879206,116.492452 39.878061,116.494206 39.877897,116.493965 39.876188,116.494834 39.875715,116.494582 39.875439,116.496658 39.874406,116.496084 39.873319,116.495746 39.873212,116.495735 39.872182,116.498192 39.872158,116.498278 39.871536,116.498299 39.8707,116.499705 39.870696,116.499662 39.86888,116.502188 39.868815,116.502167 39.868267,116.504152 39.868246,116.504152 39.867814,116.508358 39.867814,116.508298 39.86062,116.507961 39.860617,116.50795 39.859694,116.508288 39.85969,116.508299 39.85997,116.509709 39.859262,116.509747 39.859307,116.509554 39.859418,116.509506 39.860102,116.511185 39.860114,116.511126 39.858566,116.511372 39.858455,116.51148 39.859505,116.512209 39.860423,116.512118 39.860481,116.512316 39.860802,116.511437 39.861119,116.511539 39.862111,116.511919 39.862099,116.512123 39.862004,116.51222 39.862161,116.51229 39.862136,116.512638 39.862626,116.512955 39.862478,116.512982 39.863063,116.512901 39.863063,116.513239 39.864104,116.513454 39.8641,116.513464 39.864417,116.51354 39.864471,116.515562 39.864487,116.515701 39.864994,116.512434 39.866678,116.512097 39.867019,116.51193 39.86881,116.514215 39.868703,116.514269 39.868473,116.51553 39.86865,116.51568 39.867991,116.516935 39.868143,116.516925 39.868489,116.517354 39.871145,116.517295 39.871359,116.516984 39.871631,116.516812 39.872038,116.511662 39.87161,116.511882 39.872866,116.512 39.880391,116.511834 39.881416,116.511399 39.881388,116.510085 39.88154,116.508733 39.881437,116.508111 39.883034,116.508014 39.88303,116.508009 39.883306,116.508765 39.883302,116.508744 39.888056,116.509001 39.889698,116.50884 39.889702,116.508599 39.891822)),((116.508288 39.85969,116.515353 39.856248,116.514382 39.854971,116.514854 39.854716,116.5159 39.855972,116.516393 39.855729,116.521114 39.861329,116.522552 39.860604,116.517853 39.855004,116.520513 39.85367,116.520309 39.853357,116.519966 39.852829,116.511469 39.852829,116.510096 39.853225,116.509066 39.852039,116.506405 39.852632,116.507939 39.854337,116.507896 39.857096,116.507928 39.858191,116.508052 39.859192,116.508288 39.85969)),((116.504501 39.859892,116.503996 39.859888,116.503851 39.859756,116.503798 39.859554,116.502323 39.859538,116.50236 39.86016,116.503696 39.86016,116.503701 39.860279,116.503808 39.860279,116.503835 39.860682,116.503964 39.860682,116.503964 39.86037,116.504511 39.860365,116.504501 39.859892)))',
    'MULTIPOLYGON(((116.527058 39.88742,116.527042 39.889657,116.523925 39.889637,116.522126 39.890042,116.523952 39.890283,116.52731 39.89027,116.527294 39.891151,116.536215 39.891077,116.536204 39.890028,116.536805 39.889801,116.537519 39.889781,116.539626 39.887914,116.538138 39.887835,116.53491 39.887843,116.534611 39.887925,116.533585 39.887905,116.532669 39.881548,116.532031 39.875875,116.523571 39.875739,116.516705 39.876324,116.516812 39.872038,116.511662 39.87161,116.511882 39.872866,116.512 39.880391,116.511834 39.881416,116.511399 39.881388,116.510085 39.88154,116.508733 39.881437,116.508111 39.883034,116.508014 39.88303,116.508009 39.883306,116.508765 39.883302,116.508744 39.888056,116.509001 39.889698,116.50884 39.889702,116.508677 39.891139,116.509141 39.891081,116.509666 39.890954,116.510407 39.8906,116.51097 39.890102,116.511367 39.889538,116.511984 39.889986,116.511995 39.890119,116.513442 39.890206,116.514184 39.890391,116.514328 39.889888,116.514704 39.89018,116.515294 39.890349,116.515921 39.890427,116.516554 39.890419,116.516769 39.887208,116.513186 39.887237,116.513169 39.88487,116.521232 39.884829,116.521173 39.886693,116.522955 39.886688,116.522955 39.887223,116.527058 39.88742)))',
    'MULTIPOLYGON(((116.532031 39.875875,116.523571 39.875739,116.516705 39.876324,116.516812 39.872038,116.516984 39.871631,116.517295 39.871359,116.517354 39.871145,116.516925 39.868489,116.523909 39.868288,116.523829 39.867435,116.523871 39.867435,116.523823 39.867056,116.52289 39.866966,116.522884 39.86683,116.521629 39.865377,116.523108 39.864669,116.525652 39.865014,116.526479 39.864981,116.527074 39.867275,116.526881 39.867732,116.526897 39.868185,116.531988 39.868012,116.531902 39.864693,116.541139 39.864405,116.541156 39.865784,116.541241 39.865895,116.540598 39.866571,116.540244 39.867122,116.539686 39.869152,116.539546 39.869296,116.539643 39.870404,116.537755 39.870659,116.537899 39.872837,116.53761 39.873101,116.537626 39.873261,116.540265 39.872899,116.540646 39.872965,116.54041 39.875616,116.54019 39.876,116.532031 39.875875)))',
    'MULTIPOLYGON(((116.533585 39.887905,116.532669 39.881548,116.532031 39.875875,116.545946 39.876089,116.546096 39.879914,116.549513 39.880527,116.549041 39.880992,116.548553 39.884817,116.548242 39.885072,116.544288 39.884985,116.544108 39.887812,116.542523 39.887708,116.539626 39.887914,116.538138 39.887835,116.53491 39.887843,116.534611 39.887925,116.533585 39.887905)))',
    'MULTIPOLYGON(((116.54019 39.876,116.54041 39.875616,116.540646 39.872965,116.540265 39.872899,116.537626 39.873261,116.53761 39.873101,116.537899 39.872837,116.537755 39.870659,116.539643 39.870404,116.539546 39.869296,116.539686 39.869152,116.540244 39.867122,116.540598 39.866571,116.541241 39.865895,116.541156 39.865784,116.541139 39.864405,116.542658 39.864388,116.542658 39.863709,116.542545 39.863091,116.54255 39.862165,116.543865 39.862169,116.542792 39.861387,116.543151 39.86107,116.543865 39.860794,116.543822 39.860645,116.544991 39.860411,116.54608 39.860246,116.546075 39.86016,116.546461 39.860098,116.546477 39.860139,116.546676 39.860106,116.547217 39.866328,116.553848 39.866052,116.553928 39.867468,116.55557 39.867406,116.555586 39.86781,116.557667 39.867752,116.556991 39.869152,116.557463 39.869144,116.557946 39.868181,116.56205 39.868341,116.561278 39.870404,116.560693 39.871618,116.559121 39.87159,116.558461 39.873187,116.559834 39.873286,116.55918 39.87476,116.55845 39.874047,116.55756 39.875954,116.554095 39.875916,116.549513 39.880527,116.546096 39.879914,116.545946 39.876089,116.54019 39.876)))',
    'MULTIPOLYGON(((116.543822 39.860645,116.543548 39.859781,116.543366 39.859772,116.543237 39.859114,116.543398 39.859089,116.542454 39.85607,116.540839 39.856507,116.540925 39.852899,116.539691 39.853114,116.53541 39.855288,116.53533 39.855181,116.528721 39.858463,116.528313 39.858541,116.51562 39.8647,116.515991 39.865208,116.515986 39.864973,116.516377 39.864788,116.516855 39.866155,116.51715 39.866163,116.518394 39.865525,116.518561 39.865722,116.52238 39.8638,116.523108 39.864669,116.525652 39.865022,116.526479 39.864981,116.527074 39.867275,116.526881 39.867732,116.526897 39.868185,116.531988 39.868012,116.531902 39.864693,116.541139 39.864405,116.542658 39.864388,116.542658 39.863709,116.542545 39.863091,116.54255 39.862165,116.543865 39.862169,116.542792 39.861387,116.543151 39.86107,116.543865 39.860794,116.543822 39.860645)))'
]

var geoJson = {
  type: 'FeatureCollection',
  features: layerData.map(function (polygon, index) {
    return {
      type: 'Feature',
      geometry: {
        type: 'MultiPolygon',
        coordinates: polygon.match(/\\(([^)]+)\\)/g).map(function (match) {
          return [
            match.slice(1, -1).split(',').map(function (pair) {
              var coordinate = pair.replace(/\\(/g, '').replace(/\\)/g, '').split(' ').map(Number)
              return [coordinate[0], coordinate[1]] // Swap lat and lon
            })
          ]
        })
      },
      properties: {
        name: '区域' + index
      }
    }
  })
}

console.log('geoJson', JSON.stringify(geoJson));`)

        

        return {
            toGeoJsonCode1,
        }
    }
})
</script>

<style scoped>

</style>